<template>
<div>
  <div style="height:200px;background:pink">轮播图</div>
  <ul class="nav">
    <router-link to='/home' tag="li" active-class="active">首页</router-link>
    <router-link to='/goods' tag="li" active-class="active">商品</router-link>
    <router-link to='/mine' tag="li" active-class="active">我的</router-link>
  </ul>
  <router-view></router-view>
</div>
</template>

<script>
    export default{

    }
</script>

<style lang="scss" scoped>
    .nav{
      width: 100%;
      height: 50px;
      display:flex;
      position: fixed;
      left: 0;
      bottom: 0;
      li{
        flex: 1;
        text-align: center;
        line-height: 50px;
      }
    }
    .active{
      background-color:gray;
      color:white;
    }

</style>
